<!--
 * @Author: Liz.Zheng
 * @Date: 2021-12-07 19:25:02
 * @LastEditTime: 2021-12-20 18:03:40
 * @LastEditors: Liz.Zheng
 * @Description: 文字提示
 * @Motto: Write the code. Change the world.
-->
<template>
  <a-tooltip>
    <template #title>
      <div v-for="(tip, index) of tips" :key="index">
        <span v-if="showNo"> {{ index + 1 }}、</span>
        <span> {{ tip }}</span>
      </div>
    </template>
    <ExclamationCircleOutlined
      v-if="iconType == 'exclamation'"
      style="margin-left: 5px; color: #faad14; font-size: 14px"
    />
    <QuestionCircleOutlined
      v-else
      style="margin-left: 5px; color: #999; font-size: 14px"
    />
  </a-tooltip>
</template>

<script>
import { defineComponent } from "vue";
import {
  QuestionCircleOutlined,
  ExclamationCircleOutlined,
} from "@ant-design/icons-vue";

export default defineComponent({
  name: "TextTip",
  props: {
    tips: {
      type: Array,
      default: () => {
        return [];
      },
    },
    showNo: {
      type: Boolean,
      default: false,
    },
    iconType: {
      type: String,
      default: "",
    },
  },
  components: {
    QuestionCircleOutlined,
    ExclamationCircleOutlined,
  },
  setup(props) {},
});
</script>
